<style>
    .menu{
        /*position: fixed;*/
        bottom: 0px;
        top: 0px;
        /*z-index: 10;*/
        width: 10%;
        min-width: 50px;
        max-width: 100px;
        /*left: -100px;*/
        background: #000;
        /*-webkit-transition: all 0.3s ease;*/
        /*transition: all 0.3s ease;*/
        float: left;
    }
    .menu.show{
        /*-webkit-transform: translateX(100px);*/
        /*transform: translateX(100px);*/
    }
    .menu ul{
        padding-top: 40px;
        /*z-index: 99;*/
    }
    .menu li{
        list-style: none;
    }
    .menu a{
        display: block;
        height: 40px;
        line-height: 40px;
        color: #fff;
        font-size: 16px;
        text-align: center;
        text-decoration: none;
    }
    .menu a:hover, .menu a.active, .menu .v-link-active{
        background: #31c27c;
        color: #fff;
    }
    .btn-close{
        color: #fff;
        line-height: 40px;
        text-align: center;
        border-top: 1px solid #fff;
        cursor: pointer;
    }
    .btn-close:hover{
        background: #31c27c;
        color: #fff;
    }
    .menu-shadow{
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.2);
        display: none;
    }
    .show{
        display: block;
    }
</style>
<template>
    <div :class="show?'menu show': 'menu'">
        <ul>
            <li>
                <a v-link="{ path: '/main/fund_query'}">资金查询</a>
            </li>
            <li>
                <a v-link="{ path: '/main/bank_query'}">银行资金</a>
            </li>
            <li>
                <a v-link="{ path: '/main/sys_check'}">系统核对</a>
            </li>
            <li>
                <a v-link="{ path: '/main/person_check'}">人工核对</a>
            </li>
            <li>
                <a v-link="{ path: '/main/pass_query'}">核销查询</a>
            </li>
            <li>
                <a v-link="{ path: '/main/nopass_query'}">差额查询</a>
            </li>
            <li>
                <a v-link="{ path: '/main/deposit_analysis'}">沉淀分析</a>
            </li>
        </ul>
        <div class="btn btn-close" @click="logout">
            安全退出
        </div>
    </div>
    <!--<div :class="show? 'menu-shadow show': 'menu-shadow'"></div>-->
</template>
<script>
    module.exports = {
        data: function(){
            return {};
        },
        props: ["show"],
        methods: {
            logout: function(){
                console.log("logout");
                this.$router.go("/login");
            }
        }
    }
</script>